<template>
  <!-- 添加题库 -->
  <view class="box">
    <view class="title">
      题目：<textarea @input="GetTitle" type="text" />
    </view>
    <view class="choose">
      选项A：<input @input="GetChoose" type="text" />
    </view>
    <view class="choose">
      选项B：<input @input="GetChooseB" type="text" />
    </view>
    <view class="choose">
      选项C：<input @input="GetChooseC" type="text" />
    </view>
    <view class="choose">
      选项D：<input @input="GetChooseD" type="text" />
    </view>
    <view class="answer">
      正确选项：<input @input="GetAnswer" placeholder="请输入选项" type="text" />
    </view>
    <view class="type">
      请输入题型：<input placeholder="单选多选或判断" @input="GetType" type="text" />
    </view>
    <view class="rigth">
      请输入答案解析：<textarea @input="GetRigth"></textarea>
    </view>
    <button @click="btn" class="btn">提交</button>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        titles:'',
        choose:'',
        chooseA:'',
        chooseB:'',
        chooseC:'',
        rigth:'',
        answer:'',
        type:'',
        value:['A','B','C','D']
      }
    },
    methods: {
      GetTitle(e){
        this.titles = e.detail.value
        // console.log(e.detail.value)
      },
      GetChoose(e){
        this.choose = e.detail.value
        // console.log(e.detail.value)
      },
      GetChooseB(e){
        this.chooseA = e.detail.value
        // console.log(e.detail.value)
      },
      GetChooseC(e){
        this.chooseB = e.detail.value
        // console.log(e.detail.value)
      },
      GetChooseD(e){
        this.chooseC = e.detail.value
        // console.log(e.detail.value)
      },
      GetAnswer(e){
        // console.log(e.detail.value);
        this.answer = e.detail.value
      },
      GetType(e){
        // console.log(e.detail.value);
        this.type = e.detail.value
      },
      GetRigth(e){
        // console.log(e.detail.value);
        this.rigth = e.detail.value
      },
      btn(){
        uniCloud.database().collection("mix").add({
          answer:this.answer,
          rigth:this.rigth,
          type:this.type,
          title:this.titles,
          options: [
                  {
                      code: this.value[0],
                      option: this.choose
                  },
                  {
                      code: this.value[1],
                      option: this.chooseA
                  },
                  {
                      code: this.value[2],
                      option: this.chooseB
                  },
                  {
                      code: this.value[3],
                      option: this.chooseC
                  }
              ],
        })
            uni.showToast({
              title:"录入成功"
            })
            // uni.navigateTo({
            //   url:'/pages/race/race'
            // })
      }
    },
    onLoad() {
      uni.request({
        url:"https://3fc8-120-239-44-172.ngrok-free.app/api/document/questions",
        method:'GET',
        success: res => {
          console.log(res);
        }
        
      })
    }
  }
</script>

<style scoped lang="scss">
.box{
  view{
    padding: 10rpx;
    textarea{
      border: 2rpx solid #999;
      border-radius: 10rpx;
      width: 80%;
      margin: 10rpx;
    }
    input{
      border: 2rpx solid #999;
      border-radius: 10rpx;
      width: 80%;
      margin: 10rpx;
      padding-left: 10rpx;
    }
  }


  .btn{
    width: 60%;
    margin-top: 50rpx;
  }
}
</style>
